<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Security-Policy" content="default-src *; img-src blob: data: *; script-src blob: data 'self' 'unsafe-inline'; worker-src blob: data 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src blob: data: mediastream: *; connect-src http://localhost:22444">
    <title>veonim</title>
    <style>
@font-face {
  font-family: 'Roboto Mono Veonim';
  src: url('../assets/roboto-mono.ttf');
}

html {
  --font: 'Roboto Mono Veonim';
  --font-size: 14;
  --line-height: 1.5;
  font-family: var(--font);
  font-size: calc(var(--font-size) * 1px);
}

body {
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
  font-size: 14px;
}

code {
  font-family: var(--font);
  color: var(--foreground-30);
}

pre {
  font-family: var(--font);
  color: var(--foreground-30);
}

body {
  margin: 0;
  padding: 0;
  background: #222;
  color: #ddd;
  overflow: hidden;
  height: 100vh;
  width: 100vw;
  display: flex;
  flex-flow: column;
}

input {
  width: 100%;
  box-sizing: border-box;
  outline: none;
  border: none;
  background: none;
  line-height: var(--line-height);
  padding: 0;
  color: var(--foreground-b60);
}

input::placeholder {
  color: var(--foreground-70);
}

.show-cursor * {
  cursor: default;
}

#start {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
  height: 100%;
  width: 100%;
  z-index: 420;
  background: #29272d;
}

#start .logo {
  margin-top: 100px;
  flex: 1;
  height: 100%;
  width: 100%;
  background: url('../assets/header.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position-x: center;
}

#start .detail {
  padding-top: 10px;
  font-size: 18px;
  font-family: Helvetica, Arial, sans-serif;
  color: #555;
  flex: 2;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
    </style>
  </head>
  <body>
    <div id="notifications"></div>

    <div id="workspace">
      <div id="webgl"></div>
      <div id="windows"></div>
      <div id="cursor"></div>
      <div id="cursorline"></div>
      <div id="debugline"></div>
      <div id="plugins"></div>
    </div>

    <div id="statusline"></div>

    <script type="text/javascript">require('../bootstrap/galaxy')</script>
  </body>
</html>
